<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="./js/rem-fengzhuang.js"></script>
    <script src="./js/swiper.min.js"></script>
    <script src="./js/cj.js"></script>
    <link rel="stylesheet" href="./css/cj.css">
    <link rel="stylesheet" href="./css/swiper.min.css">

</head>

<body>
    <div class="cj">
        <div class="bigheader">
            <div class="header">
                <a href="javascrip:;" class="h-pic"></a>
                <div class="h-tit">
                    <div class="gname">和平精英</div>
                    <div class="gintro">腾讯自研反恐军事竞赛体验手游</div>
                </div>
                <a href="javascript:;" class="h-download"></a>
                <a href="javascript:;" class="O">
                    <span></span>
                </a>
            </div>
        </div>
        <div class="menu">
            <ul>
                <li><a href="#">官网首页</a></li>
                <li><a href="#">游戏资料</a></li>
                <li><a href="#">赛事中心</a></li>
                <li><a href="#">攻略中心</a></li>
                <li><a href="#">视频中心</a></li>
                <li><a href="#">CDK兑换</a></li>
            </ul>
        </div>
        <div class="swiper-container" id="swiper1">
            <div class="swiper-wrapper " id="s1">
                <div class="swiper-slide" ><a href="#">
                    <img src="./picture/ban1.jpg" alt=""></a>
                    <p>特训军需 极限来袭</p>
                </div>
                <div class="swiper-slide"><a href="#"><img src="./picture/ban2.jpg" alt=""></a>
                    <p>全新艺帝帝 最强特种兵</p>
                </div>
                <div class="swiper-slide"><a href="#"><img src="./picture/ban3.jpg" alt=""></a>
                    <p>解说招募 即将开启</p>
                </div>
            </div>
            <!-- 如果需要分页器 -->
            <div class="swiper-pagination"></div>
    
        </div>
        <div class="tixing">
            <span class="age"></span>
            <span class="jkxt">该游戏为腾讯健康系统"16+"试运行，未满16周岁用户将无法登录。</span>
        </div>
        <div class="sec1 auto">
            <a href="#"><img src="./picture/guide1.png" alt="javascript:;"></a>
            <a href="#"><img src="./picture/guide2.png" alt="javascript:;"></a>
            <a href="#"><img src="./picture/guide3.png" alt="javascript:;"></a>
            <a href="#"><img src="./picture/guide4.png" alt="javascript:;"></a>
        </div>
        <div class="sec2 auto">
            <div class="p1">
                <div class="p1-pic"></div>
                <div class="p1-new">新闻资讯</div>
                <div class="p1-news">NEWS</div>
                <div class="p1-more">更多</div>
                <div class="p1-plus"></div>
            </div>
            <div class="p2">
                <ul class="p2-tit">
                    <li><a href="#">最新</a>
                        <div class="underline"></div>
                    </li><span class="fenge"></span>
                    <li><a href="#">新闻</a></li><span class="fenge"></span>
                    <li><a href="#">公告</a></li><span class="fenge"></span>
                    <li><a href="#">最新</a></li>
                </ul>
                <div class="p2-cont">
                    <li><a href="#" class="newests">[最新]</a><a href="#" class="gonggao">《和平精英》6月10日外挂打击公告</a><a href="#"
                            class="date">06-10</a></li>
                    <li><a href="#" class="newests">[最新]</a><a href="#" class="gonggao">《和平精英》6月10日外挂打击公告</a><a href="#"
                            class="date">06-10</a></li>
                    <li><a href="#" class="newests">[最新]</a><a href="#" class="gonggao">《和平精英》6月10日外挂打击公告</a><a href="#"
                            class="date">06-10</a></li>
                    <li><a href="#" class="newests">[最新]</a><a href="#" class="gonggao">《和平精英》6月10日外挂打击公告</a><a href="#"
                            class="date">06-10</a></li>
                    <li><a href="#" class="newests">[最新]</a><a href="#" class="gonggao">《和平精英》6月10日外挂打击公告</a><a href="#"
                            class="date">06-10</a></li>
                </div>
            </div>
        </div>
        <div class="sec3 auto">
            <div class="p1">
                <div class="p1-pic"></div>
                <div class="p1-new">玩法资料</div>
                <div class="p1-news">DATA</div>
            </div>
            <div class="p2">
                <div class="map">
                    <a href="#" class="p2-pic"><img src="./picture/wanfa1.jpg" alt="javascript:;"></a>
                    <div class="mask">丰富地图</div>
                </div>
            </div>
            <div class="p3">
                <p>海岛遍布林木，地形多样；雨林植被被密集，交战刺激；雪地冰雪覆盖，玩法丰富；沙漠视野开阔，适合狙击手发挥；丰富地图，打造多变的战斗体验</p>
            </div>
        </div>
        <!-- <div class="sec4 auto">
            <div class="p1">
                <div class="p1-pic"></div>
                <div class="p1-new">视频中心</div>
                <div class="p1-news">VIDEO</div>
                <div class="p1-more">更多</div>
                <div class="p1-plus"></div>
            </div>
            <div class="p2">
                <ul class="p2-tit">
                    <li><a href="#">玩法技巧</a>
                    <div class="underline"></div>
                    </li><span class="fenge"></span>
                    <li><a href="#">官方视频</a></li><span class="fenge"></span>
                    <li><a href="#">娱乐集锦</a></li>
                </ul>
            </div>
            <ul class="p3">
                <li></li>
            </ul>
        </div> -->
        <div class="sec5 auto">
            <div class="p1">
                <div class="p1-pic"></div>
                <div class="p1-new">攻略中心</div>
                <div class="p1-news">RAIDERS</div>
                <div class="p1-more">更多</div>
                <div class="p1-plus"></div>
            </div>
            <div class="p2">
                <div class="map">
                    <a href="#" class="p2-pic"><img src="./picture/wanfa2.jpg" alt="javascript:;"></a>
                    <div class="mask">
                        <p>Di~Di~Di~骑上我心爱的小motor，它永远也不会堵车~</p>
                    </div>
                </div>
            </div>
            <ul class="p3">
                <li><a href="#">【攻略】</a><a href="javascript:;" class="gun">战术枪托对M16A4与MK47的改变</a><a href="#" class="date">06-12</a></li>
                <li><a href="#">【攻略】</a></a><a href="javascript:;" class="gun">战术枪托对M16A4与MK47的改变</a><a href="#" class="date">06-12</a></li>
                <li><a href="#">【攻略】</a></a><a href="javascript:;" class="gun">战术枪托对M16A4与MK47的改变</a><a href="#" class="date">06-12</a></li>
                <li><a href="#">【攻略】</a></a><a href="javascript:;" class="gun">战术枪托对M16A4与MK47的改变</a><a href="#" class="date">06-12</a></li>
                <li><a href="#">【攻略】</a></a><a href="javascript:;" class="gun">战术枪托对M16A4与MK47的改变</a><a href="#" class="date">06-12</a></li>
            </ul>
        </div>
        <div class="sec6 auto">
            <div class="p1">
                <div class="p1-pic"></div>
                <div class="p1-new">游戏特色</div>
                <div class="p1-news">FEATURE</div>
            </div>
            <div class="swiper-container" id="swiper2">
                <div class="swiper-wrapper">
                    <div class="swiper-slide"><a href="#"><img src="./picture/swiper_2_1.jpg" alt="javascript:;"></a></div>
                    <div class="swiper-slide"><a href="#"><img src="./picture/swiper_2_2.jpg" alt="javascript:;"></a></div>
                    <div class="swiper-slide"><a href="#"><img src="./picture/swiper_2_3.jpg" alt="javascript:;"></a></div>
                    <div class="swiper-slide"><a href="#"><img src="./picture/swiper_2_4.jpg" alt="javascript:;"></a></div>
                </div>
                <div class="swiper-button-prev"></div><!--左箭头。如果放置在swiper-container外面，需要自定义样式。-->
                <div class="swiper-button-next"></div><!--右箭头。如果放置在swiper-container外面，需要自定义样式。-->
                <!-- 如果需要分页器 -->
                <!-- <div class="swiper-navigation"></div> -->
    
            </div>
        </div>
        <div class="sec7 auto">
           <div class="p1">
               <ul class="top">
                   <li>
                       <a href="">
                       <img src="./picture/code2_m.png" alt="">
                       <p>官方公众号</p>
                    </a>
                   </li>
                   <li>
                    <a href="">
                        <img src="./picture/code4_m.png" alt="">
                        <p>官方微博</p>
                     </a>
                   </li>
                   <li>
                    <a href="">
                        <img src="./picture/code2_m.png" alt="">
                        <p>微信用户社区</p>
                     </a>
                   </li>
                   <li>
                    <a href="">
                        <img src="./picture/code1_m.png" alt="">
                        <p>QQ用户社区</p>
                     </a>
                   </li>
               </ul>
               <ul class="bot">
                   <div class="log"></div>
                   <div class="copyright">COPYRIGHT © 1998 - 2019 TENCENT. ALL RIGHTS RESERVED.</div>
                   <div class="tencent">腾讯公司 版权所有</div>
               </ul>
           </div>
        </div>



</body>

</html>